<template>
  <div class="big_box">
    <!-- 第一步 资料设置 -->
    <!-- <First /> -->
    <!-- 第二步 资料维护 -->
    <!-- <Second /> -->
    <!-- 第三步 工单配置 -->
    <!-- <Third /> -->
    <!-- 第四步 资料设置 -->
    <!-- <Fourth /> -->
    <!-- <Fifth /> -->

    <div class="app-container">
      <div class="app-container-inner">
        <h3 class="h3_mrb">基础设置</h3>
        <ul class="ul_card">
          <li
            v-for="(item, index) in list"
            :key="index"
            v-permission="item.permission"
            class="li_card"
            @click="baseGo(index)"
          >
            <i
              v-if="item.img.includes('iconfont')"
              :class="item.img"
              class="img_size"
              :style="{ 'background-color': item.bgcolor }"
              aria-hidden="true"
            ></i>
            <i
              v-else
              :class="`fa ${item.img}`"
              class="img_size"
              :style="{ 'background-color': item.bgcolor }"
              aria-hidden="true"
            ></i>
            <div>
              <h4 class="h4_mrb">{{ item.name }}</h4>
              <span class="color_9">{{ item.tip }}</span>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <div class="app-container">
      <div class="app-container-inner">
        <h3 class="h3_mrb">条码管理</h3>
        <ul class="ul_card">
          <li
            v-for="(item, index) in codeSet"
            :key="index"
            v-permission="item.permission"
            class="li_card"
            @click="baseGo2(index)"
          >
            <i
              :class="`fa ${item.img}`"
              class="img_size"
              :style="{ 'background-color': item.bgcolor }"
              aria-hidden="true"
            ></i>
            <div>
              <h4 class="h4_mrb">{{ item.name }}</h4>
              <span class="color_9">{{ item.tip }}</span>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <div class="app-container">
      <div class="app-container-inner">
        <h3 class="h3_mrb">接入设置</h3>
        <ul class="ul_card_">
          <li
            v-for="(item, index) in pickUp"
            :key="index"
            v-permission="item.permission"
            class="li_card"
            @click="baseGo3(item.toUrl)"
          >
            <i
              :class="`fa ${item.img}`"
              class="img_size"
              :style="{ 'background-color': item.bgcolor }"
              aria-hidden="true"
            ></i>
            <div>
              <h4 class="h4_mrb">{{ item.name }}</h4>
              <span class="color_9">{{ item.tip }}</span>
            </div>
          </li>
        </ul>
      </div>
    </div>
    <div class="app-container" style="flex: 1; padding-bottom: 12px">
      <div class="app-container-inner">
        <h3 class="h3_mrb">平台设置</h3>
        <ul class="ul_card_">
          <li
            v-for="(item, index) in sysSet"
            :key="index"
            v-permission="item.permission"
            class="li_card"
            @click="baseGo4(item.toUrl)"
          >
            <i
              v-if="item.img.includes('iconfont')"
              :class="item.img"
              class="img_size"
              :style="{ 'background-color': item.bgcolor }"
              aria-hidden="true"
            ></i>
            <i
              v-else
              :class="`fa ${item.img}`"
              class="img_size"
              :style="{ 'background-color': item.bgcolor }"
              aria-hidden="true"
            ></i>
            <div>
              <h4 class="h4_mrb">{{ item.name }}</h4>
              <!-- <span class="color_9">{{ item.tip }}</span> -->
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script setup lang="ts">
  import { useRouter } from 'vue-router'
  import { ref } from 'vue'
  import { HMessage, HMessageBox } from '@/components/common/message'
  import { useActiveTab as useOrderSetActiveTab } from '@/services/pages/order/set'
  import { useActiveTab as useGoogSetActiveTab } from '@/services/pages/param-set/commodity-set'
  import routeComponentName from '@/config/route-component-name'

  defineOptions({
    name: routeComponentName.setting.setting,
  })

  const router = useRouter()
  // 基础设置
  const list = ref([
    // {
    //   img: 'fa-diamond',
    //   name: '品牌管理',
    //   tip: '产品品牌设置',
    //   bgcolor: '#ff8d1a',
    // },
    {
      img: 'fa-list-alt',
      name: '产品设置',
      tip: '产品列表管理',
      bgcolor: '#43CF7C',
      permission: 'base_goods',
    },
    {
      img: 'fa-address-book-o',
      name: '客户设置',
      tip: '客户基础设置',
      bgcolor: '#7948EA',
      permission: 'base_user',
    },
    {
      img: 'fa-map-marker',
      name: '网点设置',
      tip: '网点基础设置',
      bgcolor: '#AC33C1',
      permission: 'base_network',
    },
    {
      img: 'fa-gears',
      name: '工单设置',
      tip: '工单基础设置',
      bgcolor: '#00C0C0',
      permission: 'base_order',
    },
    {
      img: 'fa-jpy',
      name: '费用项目',
      tip: '费用类型设置',
      bgcolor: '#AC33C1',
      permission: 'base_fee',
    },
    {
      img: 'fa-cube',
      name: '返厂设置',
      tip: '返厂基础设置',
      bgcolor: '#007cff',
      permission: 'base_returnFactory',
    },
    {
      img: 'fa-calendar-minus-o',
      name: '仓储设置',
      tip: '仓储基础设置',
      bgcolor: '#ff8d1a',
      permission: 'base_storage',
    },
    {
      img: 'iconfont icon-cangku_kucun',
      name: '仓库列表',
      tip: '仓库列表',
      bgcolor: '#7948EA',
      permission: 'base_storage',
    },
    {
      img: 'iconfont icon-shenpi',
      name: '审批设置',
      tip: '审批设置',
      bgcolor: '#007cff',
      permission: 'base_storage',
    },
  ])

  // 条码设置
  const codeSet = ref([
    {
      img: 'fa-calendar',
      name: '条码设置',
      tip: '条码基础设置',
      bgcolor: '#ff8d1a',
      permission: 'base_code',
    },
    {
      img: 'fa-calendar-check-o',
      name: '条码策略',
      tip: '条码策略设置',
      bgcolor: '#00c0c0',
      permission: 'base_strategy',
    },
    {
      img: 'fa-calendar-check-o',
      name: '批次列表',
      tip: '批次列表页面',
      bgcolor: '#007cff',
      permission: 'base_strategy',
    },
  ])

  // 接入设置
  const pickUp = ref([
    {
      img: 'fa-link',
      name: '服务页面',
      tip: '公司报单页面',
      bgcolor: '#43CF7C',
      toUrl: '/busic/base/inforset?active=service',
      permission: 'base_service',
    },
    {
      img: 'fa-wechat',
      name: '微信公众号',
      tip: '微信公众号对接',
      bgcolor: '#43CF7C',
      // toUrl: '/busic/base/inforset?active=wxInter',
      toUrl: '',
      permission: 'base_wxInter',
    },
    {
      img: 'fa-truck',
      name: '物流服务',
      tip: '物流服务对接',
      bgcolor: '#FF8D1A',
      toUrl: '',
      permission: 'base_logistics',
    },
    {
      img: 'fa-server',
      name: '支付服务',
      tip: '支付渠道对接',
      bgcolor: '#AC33C1',
      toUrl: '',
      permission: 'base_pay',
    },
    {
      img: 'fa-comments-o',
      name: '微信通知',
      tip: '微信通知设置',
      bgcolor: '#43CF7C',
      // toUrl: '/busic/base/inforset?active=wxNotice',
      toUrl: '',
      permission: 'base_wxNotice',
    },
    {
      img: 'fa-commenting-o',
      name: '手机短信',
      tip: '短信通知设置',
      bgcolor: '#007cff',
      toUrl: '/note/list',
      permission: 'base_sms',
    },
  ])
  //平台设置
  const sysSet = ref([
    {
      img: 'fa-address-book-o',
      name: '企业信息',
      // tip: '条码激活设置',
      bgcolor: '#7948EA',
      toUrl: '/basedata/platform?typeVal=2',
      permission: 'base_userInfo',
    },
    {
      img: 'fa-calendar',
      name: '全局设置',
      // tip: '条码基础设置',
      bgcolor: '#ff8d1a',
      toUrl: '/basedata/platform?typeVal=3',
      permission: 'base_whole',
    },
    {
      img: 'fa-diamond',
      name: '操作日志',
      // tip: '条码激活设置',
      bgcolor: '#00c0c0',
      toUrl: '/basedata/journal',
      permission: 'base_oprate',
    },
    {
      img: 'iconfont icon-shengchanshujubeifencunchu',
      name: '数据备份',
      bgcolor: '#007cff',
      toUrl: '/basedata/backups',
      permission: 'base_oprate',
    },
    // {
    //   img: 'fa-diamond',
    //   name: '帮助中心',
    //   tip: '条码激活设置',
    //   bgcolor: '#00c0c0',
    //   toUrl: '/basedata/platform'
    // },
  ])
  //
  const baseGo = (val: number) => {
    switch (val + 1) {
      case 1:
        useGoogSetActiveTab().setActiveTab('brandSet')
        router.push('/busic/base/proset')
        break
      case 2:
        router.push('/busic/base/customset')
        break
      case 3:
        router.push('/busic/base/branchset')
        break
      case 4:
        useOrderSetActiveTab().setActiveTab('set')
        router.push('/busic/base/orderset')
        break
      case 5:
        useOrderSetActiveTab().setActiveTab('cost')
        useOrderSetActiveTab().setFeeCostActiveTab('orderCost')
        router.push('/busic/base/orderset')
        break
      case 6:
        router.push('/busic/base/repairset')
        break
      case 7:
        router.push('/busic/base/stoset')
        break
      case 8:
        router.push('/storage/list')
        break
      case 9:
        router.push('/busic/base/check/set')
        break
      default:
        break
    }
  }
  const baseGo2 = (val) => {
    switch (val) {
      case 0:
        router.push('/busic/base/base?active=first')
        break
      case 1:
        router.push('/busic/base/base?active=second')
        break
      case 2:
        router.push('/code/new')
        break
    }
  }
  // 接入设置
  const baseGo3 = (val) => {
    if (!val) {
      // HMessage.success('正在维护，当前不可用...')
      HMessageBox.success('正在维护，当前不可用...')
      return
    }
    router.push(val)
    // switch (val) {
    //   case 0:
    //     router.push('/busic/base/inforset?active=service')
    //     break;
    //   case 1:
    //     router.push('/busic/base/inforset?active=wxInter')
    //     break;
    //   case 2:
    //     router.push('/busic/base/inforset?active=wxInter')
    //     break;
    //   case 3:
    //     router.push('/busic/base/logset')
    //     break;
    //   case 4:
    //     router.push('/busic/base/inforset?active=service')
    //     break;
    //   case 5:
    //     router.push('/busic/base/inforset?active=wxNotice')
    //     break;
    //   case 6:
    //     router.push('/busic/base/inforset?active=textNotice')
    //     break;
    //   default:
    //     break;
    // }
  }
  // 平台设置
  const baseGo4 = (val) => {
    if (!val) {
      HMessage.success('正在升级维护中，敬请期待...')
      return
    }
    router.push(val)
  }
</script>

<style lang="scss">
  @import './index';
</style>
